<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html>

<head>
  <title>唐山旅游网欢迎您</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <!-- 引入样式 -->
  <link rel="stylesheet" href="lib/elementui/theme-chalk/index.css" type="text/css">
  <style>
    body {
      margin: 0px;
    }

    /* 所有 */
    #app {
      width: 100%;
      height: 100%;
    }

    .header {
      margin: 0 auto;
      width: 1300px;
    }

    .logoimg {

      width: 150px;
      height: 50px;
    }
    .top{
      margin:0 auto;
      width: 1300px;
      margin-top: 20px;

    }
    .top-left{
      width:500px;
      height: 300px;
      float:left
    }
    .top-left-img{
      width:500px;
      height: 300px;
      border-radius: 5px;
    }
    .top-right{
      margin-left: 15px;
      background-color: bisque;
     
    }
  </style>
</head>

<body>
  <div id="app">
    <div class="header">

      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
        <el-menu-item index="0">
        <a href="/index.jsp">  <img class='logoimg' alt="" src="./static/imgs/logo.png">  </a> 
        </el-menu-item>
        <el-submenu index="1">
          <template slot="title">旅游景点</template>
          <el-menu-item index="2-1">选项1</el-menu-item>
          <el-menu-item index="2-2">选项2</el-menu-item>
          <el-menu-item index="2-3">选项3</el-menu-item>
        </el-submenu>
        <el-submenu index="2">
          <template slot="title">旅游团</template>
          <el-menu-item index="2-1">选项1</el-menu-item>
          <el-menu-item index="2-2">选项2</el-menu-item>
          <el-menu-item index="2-3">选项3</el-menu-item>
          <el-submenu index="2-4">
            <template slot="title">选项4</template>
            <el-menu-item index="2-4-1">选项1</el-menu-item>
            <el-menu-item index="2-4-2">选项2</el-menu-item>
            <el-menu-item index="2-4-3">选项3</el-menu-item>
          </el-submenu>
        </el-submenu>
        <el-menu-item index="3" >消息中心</el-menu-item>
        <el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>
      </el-menu>
    </div>
    <div class="top"> 
      <div class="top-left">
        <img class="top-left-img" src="./static/imgs/p/p1.jpg" alt="">
      </div>
      <div  class="top-right">
        <h2 class="top-right-title">
          唐山冰岛世界公园
        </h2>
        <h2 class="top-right-desc">
          唐山冰岛世界公园
        </h2>
        <h2 class="top-right-price">
          唐山冰岛世界公园
        </h2>
        <h2 class="top-right-sell">
          已售出：301张
        </h2>
        <h2 class="top-right-opentime">
          开放时间：2019-10-11 ~ 2020-10-11
        </h2>
      </div>
      <div>


      </div>
    </div>
    <div class="detail"> 
      
    </div>
    <div class="comment"> 
     
    </div>
  </div>
  <!-- 引入组件库 -->
  <script type="text/javascript" src="lib/vue.js"></script>
  <script type="text/javascript" src="lib/elementui/index.js"></script>

  <script type="text/javascript">
    new Vue({
      el: "#app",
      data: {
     
      },
      methods: {
        godetail(index) {
          console.log("/placedetail.jsp?id=" + index)
          window.location.href= "/placedetail.jsp?id=" + index
        },
        handleSelect(){

        }
      }
    });
  </script>

</body>

</html>